<template>
	<view class="index">
		<!-- <navBar>
			<view class="centerBar" slot="center">
				联坤商城
			</view>
		</navBar> -->
		<nav-bars>
			<view class="centerBar">
				选材中心
			</view>
		</nav-bars>
		
		<!-- banner -->
		<view class="i_banner">
			<!-- 搜索框 -->
			<view class="isearch">
				<view class="i_bSearch">
					<view class="i_bIcon"><view class="iconfont icon-search"></view></view>
					<view class="i_bClear" v-if="searchVal.length" @tap="searchVal = ''"><view class="iconfont icon-close"></view></view>
					<view class="i_bInput">
						<input type="text" confirm-type="search" v-model="searchVal" @confirm="searchData" placeholder="搜索您感兴趣的商品吧" placeholder-class="col-fff"/>
					</view>
				</view>
			</view>
			<view class="swiper-box">
				<swiper :autoplay="true" :interval="2000" :duration="500" :circular="true">
					<swiper-item v-for="item in bannerlist" :key="item.img_id">
						<image class="swiper-image" :src="item.img_url" mode="widthFix">
					</swiper-item>
				</swiper>
			</view>
		</view>
		
		<!-- 主页详情 -->
		<view class="i_container">
			<!-- 家居分类 -->
			<!-- <view class="i_classify">
				<view v-for="(item,index) in classList" :key="index" v-if="index<9">
					<view class="i_cItem" @click="toPagelist(item.cate_id)">
						<view class="i_cImg"><image :src="item.cate_logo"></image></view>
						<view class="i_cTxt">{{item.cate_name}}</view>
					</view>
				</view>
				<view class="i_cItem" @tap="toPage('classify')">
					<view class="i_cImg"><image src="../../../static/mall/all.png"></image></view>
					<view class="i_cTxt">全 部</view>
				</view>
			</view> -->
			<view class="IconList">
				<swiper class="swiper" :autoplay="false" @change="SwiperChange">
					<swiper-item v-for="(item,index) in classList" :key="index">
					  <u-grid :col="5" :border="false">
					  	<u-grid-item :custom-style="{'padding':'0',}" v-for="(items,indexs) in item" :key="indexs"
					  		@click="toPagelist(items.cate_id)" style="padding: 0!important;">	
						<view class="IconItem">
							<view class="IconFor">
								<view class="IconImage">
									<image :src="items.cate_logo">
									</image>
								</view>
								<view class="IconTitle">{{items.cate_name}}</view>
							</view>
						</view>
						</u-grid-item>
						</u-grid>
						<view></view>
					</swiper-item>
				</swiper>
				<view class="indicator-dots">
					<view class="indicator-dots-item" :class="[current == index ? 'indicator-dots-active' : '']"
						v-for="(item,index) in classList" :key="index">
					</view>
				</view>
			</view>
			<!-- 精选品牌 -->
			<!-- <view class="i_brand">
				<view class="i_bTip" @tap="toPage('brand')">查看全部<text class="iconfont icon-more"></text></view>
				<view class="i_bTitle">精选品牌</view>
				<view class="i_bCont">
					<view class="i_bList">
						<view class="i_bItem" v-for="item in brandList" :key="item.store_id" @tap="toPage('store', { storeId: item.store_id })">
							<view class="i_bCan">
								<view class="i_bImage"><image :src="item.back_img"></image></view>
								<view class="i_bLogo"><image :src="item.store_logo"></image></view>
								<view class="i_bName">{{item.store_name}}</view>
								<view class="i_bMenu">
									<view class="i_bmItem" v-for="(itm, idx) in item.cate_lst" :key="idx" v-if="idx<3">{{itm.cate_name}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view> -->
			<view class="i_brand">
				<view class="TitleView">
					<view class="i_rTitle">精选品牌</view>
					<view class="i_tOper" @tap="toPage('brand')">
						<view class="i_toIcon">
							<text>更多</text>
							<text class="iconfont icon-more" style="margin-top: -2rpx;"></text>
						</view>
					</view>
				</view>
				<view class="i_bList">
					<view class="i_bItem" v-for="item in brandList" :key="item.store_id"
						@tap="toPage('store', { storeId: item.store_id })">
						<view class="i_topimg"
							:style="{
							background: 'url(https://cos.ryz1620.com/liankun/static/newHome/home2.png)','background-repeat': 'no-repeat','background-size': '100% 100%',}">
			
						</view>
						<view class="i_logo">
							<image :src="item.store_logo"></image>
						</view>
						<view class="i_bottom" style="height: 90rpx;">
							<view class="i_title">{{item.store_name}}</view>
							<view class="i_des">
								<text v-for="(itm, idx) in item.cate_lst" :key="idx" v-if="idx<3">{{itm.cate_name}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 推荐商品 -->
			<view class="i_recommend">
				<view class="i_rTitle">推荐商品</view>
				<view class="i_rList">
					<u-waterfall v-model="goodsList" ref="uWaterfall">
						<template v-slot:left="{leftList}">
							<view style="padding-right: 10rpx;">
							<view class="i_rItem" v-for="(item, index) in leftList" :key="index" @click="toPage('goodsDetail', { goodsId: item.product_id })">
								<view class="i_rImage"><image :src="item.main_imgurl"></image></view>
								<view class="i_rTit omit-2">{{item.product_title}}</view>
								<view class="i_rFee"><text class="fs-20">底价 ￥</text>{{item.cost_price}}</view>
								<view class="i_rFee2"><text class="fs-20">售价 ￥</text>{{item.price}} <text class="fs-20" style="margin-left: 8rpx;">原价 ￥</text>{{item.primary_price}}</view>
								<!-- <view class="yprice" v-if="item.cost_price"><i>底价</i>￥<text>{{item.cost_price}}</text></view> -->
							</view>
							</view>
						</template>
						<template v-slot:right="{rightList}">
							<view style="padding-left: 10rpx;">
							<view class="i_rItem" v-for="(item, index) in rightList" :key="index" @click="toPage('goodsDetail', { goodsId: item.product_id })">
								<view class="i_rImage"><image :src="item.main_imgurl"></image></view>
								<view class="i_rTit omit-2">{{item.product_title}}</view>
								<view class="i_rFee"><text class="fs-20">底价￥</text>{{item.cost_price}}</view>
								<view class="i_rFee2"><text class="fs-20">售价￥</text>{{item.price}} <text class="fs-20" style="margin-left: 8rpx;">原价￥</text>{{item.primary_price}}</view>
							</view>
							</view>
						</template>
					</u-waterfall>
				</view>
			</view>
		</view>
		<view class="editBottom flex-1" style="height: calc(100rpx + env(safe-area-inset-bottom) / 2);">
		
		</view>
		<view id="tabbar" class="cu-bar1 tabbar ">
			<view class="action tabbar-icon" @tap="changeTab(item.path)" v-for="(item,index) in tablist" :key="index">
				<view class="flex_abc ">
					<image :src="item.image" mode="" class="active_image"></image>
				</view>
				<view>
					{{item.name}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import URL from '@/config/url.js'
// import navBar from '@/components/navBar/navBar.vue'
import service_mall from '@/service/now.js'
import service_enter from '@/service/enter.js'

export default {
	// components: { navBar },
	
	data() {
		return {
			// 搜索框
			searchVal: '',
			// 家居分类
			classList: [],
			// 精选品牌
			brandList: [],
			// 推荐商品
			goodsPage: 0,
			goodsList: [],
			bannerlist:[],
			enterStatus:'',
			enterType:'',
			tablist:[
				{
					name:'首页',
					path:'/pages_now/pages/mall/index/index',
					image:'https://cos.ryz1620.com/liankun/static/xuancaizhongxin/index2.png',
				},
				{
					name:'购物车',
					path:'/pages_now/pages/mall/cart/cart',
					image:'https://cos.ryz1620.com/liankun/static/xuancaizhongxin/cart1.png',
				},
				{
					name:'订单',
					path:'/pages_now/pages/mall/order/list',
					image:'https://cos.ryz1620.com/liankun/static/xuancaizhongxin/list1.png',
				},
				{
					name:'地址',
					path:'/pages_now/pages/mall/address/list',
					image:'https://cos.ryz1620.com/liankun/static/xuancaizhongxin/add1.png',
				},
			]
		}
	},
	onShow() {
		let token = this.$store.state.index.token
		if(token){
			this.getEnterStatus()
		}
		this.getGoods()
		this.getDatashop()
		this.getData()
		this.getBanner()
	},
	onReachBottom() {
		 this.getGoods()
	},
	onLoad(query) {
		// scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
		const scene = decodeURIComponent(query.scene)
		console.log(query)
		console.log(scene)
		let role = uni.getStorageSync('role')
	},

	methods: {
		// 获取入驻状态,绑定创客精英时，没入驻返回到绑定页
		async getEnterStatus(){
			let user_id = this.$store.state.index.userId
			let follow_id = uni.getStorageSync('follow_id')
			let res = await service_enter.getEnterStatus({user_id})
			console.log(res,'入驻状态')
			if(res.code==1){
				this.enterStatus = res.data.status
				this.enterType = res.data.type
				console.log(this.enterStatus,this.enterType,'入驻入驻')
				if(this.enterStatus!=1 && this.enterType==0 && follow_id){
					uni.reLaunch({
						url:'/pagesOne/distri/bandEntre/bindEntre?follow_id='+follow_id
					})
				}
			}
		},
		changeTab(url){
			uni.navigateTo({ 
				url
			})
		},
		// 获取分类
		getData() {
			service_mall.index_parent()
				.then(res => {
					if (res.code == 1) {
						let classList = res.data
						var result = [];
						for (var i = 0; i < classList.length; i += 10) {
							result.push(classList.slice(i, i + 10));
						}
						this.classList = result
					}
					else {
						this.$utils.showErr({ title: res.msg })
					}
				}) 
				.catch(err => {
					this.$utils.showErr()
				})
		},
		// 精选商家
		getDatashop() {
			service_mall.index_chosen()
				.then(res => {
					if (res.code == 1) {
						let brandList = res.data   
						this.brandList = brandList
					}
					else {
						this.$utils.showErr({ title: res.msg })
					}
				}) 
				.catch(err => {
					this.$utils.showErr()
				})
		},
		SwiperChange(e) {
			this.current = e.detail.current;
		},
		// 获取推荐商品数据
		getGoods() {
			let goodsPage = this.goodsPage
				service_mall.index_getProduct({ page: ++goodsPage })
					.then(res => {
						if (res.code == 1) {
							let data = res.data.data
							for(let i = 0;i<data.length;i++){
								this.goodsList.push(data[i])
							}
							this.goodsPage++
						}
				})
		},
		// 获取banner
		getBanner() {
				service_mall.index_banner({})
					.then(res => {
						if (res.code == 1) {
						  this.bannerlist = res.data
						}
				})
			
		},
		searchData(){
			uni.navigateTo({ url: '/pages_now/pages/mall/goods/list?keyword=' + this.searchVal })
		},
		toPagelist(id){
			uni.navigateTo({ url: '/pages_now/pages/mall/goods/list?cateId=' + id })
		},
		// 跳转页面
		toPage(page, {  goodsId, storeId } = {}) {
			// 跳转到 品牌分类
			if (page === 'brand') uni.navigateTo({ url: '/pages_now/pages/mall/store/brand' })
			// 跳转到 商家详情
			else if (page === 'store') uni.navigateTo({ url: '/pages_now/pages/mall/store/store?storeId=' + storeId })
			// 跳转到 商品分类
			else if (page === 'classify') uni.navigateTo({ url: '/pages_now/pages/mall/goods/classify' })
			// 跳转到团购
			else if (page === 'groupBuy') uni.navigateTo({ url: '/pages_now/pages/mall/goods_details/goods_details?bulkSpell=true&shopPrice=0' })
			// 跳转到限时购
			else if (page === 'limitBuy') uni.navigateTo({ url: '/pages_now/pages/mall/goods_details/goods_details?seconds=true&shopPrice=0' })
			// 跳转到商品页
			else if (page === 'goodsDetail') uni.navigateTo({ url:`/pages_now/pages/mall/goods/goods?id=${goodsId}` })
		},
	},
	
}
</script>

<style lang="scss" scoped>
.index {
	.centerBar{
		width: 100%;
		padding: 0 30rpx;
		text-align: left;
		font: 400 36rpx/50rpx PingFang SC;
		color: #000;
	}
	.i_header {width: 100%;color: #000;font-size: 36rpx;font-weight: normal;padding-left: 32rpx;}
	
	// banner
	.i_banner {width: 100%;background: #fff;overflow: hidden;
	   
		// 搜索框
		.i_bSearch {width: 686rpx;height: 62rpx;margin: 10rpx auto 0;border-radius: 32rpx;background: #dedede;position: relative;
			.i_bIcon {height: 62rpx;line-height: 62rpx;color: #fff;font-size: 32rpx;padding-left: 28rpx;position: absolute;top: 0;left: 0;}
			.i_bClear {width: 66rpx;height: 62rpx;line-height: 62rpx;text-align: center;color: #fff;font-size: 32rpx;position: absolute;top: 0;right: 0;}
			.i_bInput {height: 100%;padding: 0 68rpx;
				& > input {height: 100%;color: #fff;}
			}
		}
		.isearch{
			width: 100%;
		}
		.swiper-box{
			height: 300rpx;
			margin: 20rpx 28rpx;
			border-radius: 10rpx;
			overflow: hidden;
		}
	}
	
	// 内容
	.i_container {background: #f6f7fb;overflow: hidden;
		// 家居分类
		.i_classify {padding: 10rpx 16rpx 25rpx;background: #fff;overflow: hidden;
			.i_cItem {width: 20%;padding: 20rpx 0;float: left;}
			.i_cImg {width: 112rpx;height: 112rpx;margin: 0 auto;border-radius: 50%;background: #f6f7fb;overflow: hidden;
			         image{display: block;width: 112rpx; height:112rpx; margin: auto;border-radius: 50%;}
					 }
			.i_cTxt {height: 40rpx;line-height: 40rpx;text-align: center;color: #333;margin-top: 12rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
		}
		// 限时购/团购
		.i_activity {width: 686rpx;height: 338rpx;margin: 28rpx 32rpx 30rpx 32rpx;border-radius: 10rpx;background: #fff;overflow: hidden;
			.i_aLeft, .i_aRight {width: 50%;height: 100%;border-right: 1px solid #f8f6f3;float: left;}
			.i_aRight {border-left: 1px solid #f8f6f3;float: right;}
			.i_aTimes {font-size: 20rpx;margin: 26rpx 22rpx 0 0;float: right;display: flex;
				.i_atTime {width: 32rpx;height: 32rpx;line-height: 32rpx;text-align: center;color: #fff;border-radius: 4rpx;background: #e9423e;}
				.i_atPart {width: 14rpx;height: 32rpx;line-height: 32rpx;text-align: center;}
			}
			.i_aTit {height: 84rpx;line-height: 84rpx;font-size: 32rpx;font-weight: bold;padding-left: 18rpx;}
			.i_aList {padding-left: 20rpx;}
			.i_aItem {width: 144rpx;float: left;
				&:nth-child(1) {margin-right: 16rpx;}
			}
			.i_aImg {width: 144rpx;height: 144rpx;border-radius: 4rpx;background: #f6f7fb;overflow: hidden;}
			.i_aTip {height: 38rpx;line-height: 40rpx;text-align: center;color: #e9423e;font-size: 20rpx;margin-top: 8rpx;border-radius: 4rpx;background: #feeff2;
				&.tip1 {color: #e9423e;background: #feeff2;}
				&.tip2 {color: #ffd425;background: #fcf8dd;}
				&.tip3 {color: #939393;background: #f9f6f3;}
			}
			.i_aFee {height: 40rpx;line-height: 40rpx;color: #e9423e;font-weight: bold;margin-top: 8rpx;}
			.i_aCost {text-decoration: line-through;color: #939393;font-size: 20rpx;font-weight: normal;padding-left: 4rpx;}
		}
		// 免费使用
		.i_free {background: #fff;position: relative;
			.i_fTip {height: 34rpx;line-height: 34rpx;color: #666;font-size: 24rpx;padding: 32rpx;position: absolute;top: 0;right: 0;box-sizing: content-box;}
			.i_fTitle {height: 44rpx;line-height: 44rpx;font-size: 32rpx;font-weight: bold;padding: 24rpx 32rpx 28rpx;box-sizing: content-box;}
			.i_fCont {overflow: auto;display: flex;
				&::-webkit-scrollbar {width: 0;height: 0;color: transparentize($color: #000000, $amount: 0);} // 隐藏滚动条
			}
			.i_fList {padding: 0 32rpx 28rpx;display: flex;}
			.i_fItem {margin-right: 28rpx;
				&:nth-last-child(1) {margin: 0;}
			}
			.i_fCan {width: 483rpx;height: 264rpx;border-radius: 8rpx;background: #f6f7fb;position: relative;overflow: hidden;}			
			.i_fImage {width: 100%;height: 100%;}
			.i_fRemark {width: 100%;height: 48rpx;background: rgba(26, 28, 32, .2);position: absolute;left: 0;bottom: 0;display: flex;
				.i_frItem {height: 48rpx;line-height: 48rpx;color: #fff;font-size: 20rpx;padding: 0 16rpx;position: relative;
					&::after {content: "";width: 1px;height: 14rpx;background: #fff;position: absolute;top: 50%;right: 0;transform: translateY(-50%) scaleX(.5);}
					&:nth-child(1) {padding-left: 12rpx;}
					&:nth-last-child(1)::after {content: none;}
				}
			}
			.i_fText {min-height: 34rpx;line-height: 34rpx;font-size: 24rpx;font-weight: bold;margin-top: 8rpx;}
		}
		// 精选品牌
		// .i_brand {margin-top: 16rpx;background: #fff;position: relative;
		// 	.i_bTip {height: 34rpx;line-height: 34rpx;color: #666;font-size: 24rpx;padding: 32rpx;position: absolute;top: 0;right: 0;box-sizing: content-box;}
		// 	.i_bTitle {height: 44rpx;line-height: 44rpx;font-size: 32rpx;font-weight: bold;padding: 24rpx 32rpx 28rpx;box-sizing: content-box;}
		// 	.i_bCont {overflow: auto;display: flex;
		// 		&::-webkit-scrollbar {width: 0;height: 0;color: transparentize($color: #000000, $amount: 0);} // 隐藏滚动条
		// 	}
		// 	.i_bList {padding: 0 32rpx 28rpx;display: flex;}
		// 	.i_bItem {margin-right: 28rpx;
		// 		&:nth-last-child(1) {margin: 0;}
		// 	}
		// 	.i_bCan {width: 400rpx;height: 238rpx;border-radius: 8rpx;background: #f6f7fb;position: relative;overflow: hidden;}			
		// 	.i_bImage {width: 100%;height: 100%;filter: blur(1px);}
		// 	.i_bLogo {width: 100rpx;height: 100rpx;margin-left: -50rpx;				border: 2rpx solid #e5deca;border-radius: 50%;background: #f0f0f0;position: absolute;top: 28rpx;left: 50%;overflow: hidden;}
		// 	.i_bName {width: 100%;height: 40rpx;line-height: 40rpx;text-align: center;color: #fff;position: absolute;top: 136rpx;left: 0;}
		// 	.i_bMenu {width: 100%;height: 32rpx;position: absolute;top: 180rpx;left: 0;display: flex;justify-content: center;
		// 		.i_bmItem {height: 32rpx;line-height: 32rpx;color: #fff;font-size: 22rpx;padding: 0 28rpx 0 24rpx;position: relative;
		// 			&::after {content: "";width: 1px;height: 14rpx;background: #fff;position: absolute;top: 50%;right: 0;transform: translateY(-50%) scaleX(.5);}
		// 			&:nth-last-child(1)::after {content: none;}
		// 		}
		// 	}
		// }
		// 品牌家具
		.i_brand {
		
			margin: 8rpx 0;
			background: #fff;
			margin-top: 0rpx;
		
			.TitleView {
				display: flex;
				align-items: center;
				padding: 24rpx 32rpx 24rpx 40rpx;
				justify-content: space-between;
			}
		
			.i_tOper {
				color: #939393;
		
				.i_toIcon {
					color: #939393;
					font-size: 24rpx;
					display: flex;
					align-items: center;
				}
			}
		
			.i_rTitle {
				font-size: 36rpx;
				font-weight: 600;
				color: #333333;
			}
		
			.i_bList {
				padding: 0 32rpx 32rpx 32rpx;
				overflow-x: auto;
				white-space: nowrap;
				// margin-left: 8rpx;
		
				.i_bItem {
					margin-right: 22rpx;
					border-radius: 8rpx;
					position: relative;
					overflow: hidden;
					display: inline-block;
					background: #fff;
					box-shadow: 0rpx 0rpx 16rpx rgba(0, 0, 0, 0.06);
		
					.i_topimg {
						width: 194rpx;
						height: 90rpx;
					}
		
					.i_logo {
						height: 100rpx;
						width: 100rpx;
						border-radius: 50%;
						overflow: hidden;
						position: absolute;
						top: 40rpx;
						left: 50%;
						transform: translate(-50%, 0%);
						box-shadow: 0rpx 0rpx 16rpx rgba(0, 0, 0, 0.06);
					}
		
					.i_bottom {
						margin-top: 66rpx;
						padding-bottom: 24rpx;
		
						.i_title {
							font-size: 24rpx;
							font-weight: 500;
							line-height: 34rpx;
							color: #333333;
							text-align: center;
							margin-bottom: 2rpx;
						}
		
						.i_des {
							font-size: 16rpx;
							font-weight: 400;
							line-height: 22rpx;
							color: #939393;
							text-align: center;
						}
					}
				}
			}
		}
		
		// 推荐商品
		.i_recommend {margin-top: 16rpx;background: #fff;
			.i_rTitle {height: 44rpx;line-height: 44rpx;font-size: 32rpx;font-weight: bold;padding: 24rpx 32rpx 28rpx;box-sizing: content-box;}
			.i_rList {padding: 0 32rpx;
				.i_rItem {padding-bottom: 28rpx;
					.i_rImage {width: 100%;height: 350rpx;border-radius: 8rpx 8rpx 0rpx 0rpx;background: #f6f7fb;overflow: hidden;}
					.i_rTit {height: 68rpx;line-height: 34rpx;font-size: 24rpx;margin-top: 8rpx;}
					.i_rFee {height: 44rpx;line-height: 44rpx;color: #e9423e;font-size: 34rpx;font-weight: bold;margin-top: 8rpx;}
					.i_rFee2 {height: 30rpx;line-height: 30rpx;color: #666;font-size: 24rpx;font-weight: bold;margin-top: 8rpx;white-space: nowrap;}
				}
			}
		}
	}
}
.IconList {
		background: #FFFFFF;
		opacity: 1;
		padding: 10rpx 28rpx;

		.indicator-dots {
			// margin-top: 40rpx;
			// padding: 0rpx 0 28rpx 0;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.IconItem {
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			justify-content: center;
			// justify-content: space-between;

			.IconFor {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				// width: 20%;
				margin-bottom: 20rpx;

				.IconImage {
					width: 88rpx;
					height: 88rpx;
				}

				.IconTitle {
					font-size: 22rpx;
					color: #333333;
					margin-top: 12rpx;
				}
			}
		}

		.swiper {
			height: 320rpx;
		}

		.indicator-dots-item {
			background: #333333;
			opacity: 0.5;
			height: 10rpx;
			width: 10rpx;
			border-radius: 50%;
			margin: 0 10rpx;
		}

		.indicator-dots-active {
			background: #333333;
			opacity: 1;
		}
	}

.yprice{
		    border: 1px #E9423E solid;
		    display: inline-block;
		    font-size: 16rpx;
		    line-height: 40rpx;
			height: 34rpx;
			overflow: hidden;
		    padding-right: 10rpx;
			color: #e9423e;
		    margin-top: 10rpx;
			border-radius: 3rpx;
		i{
			    display: inline-block;
			    background: #E9423E;
			    color: #fff;
			    font-weight: normal;
			    font-size: 16rpx;
				line-height: 34rpx;
				float: left;
			    padding: 0 10rpx;
			    margin-right: 5rpx;
		}
		text{
			    font-size: 22rpx;
		}
	}
#tabbar {
		position: fixed !important;
		bottom: 0;
		left: 0;
		width: 100%;
		overflow: visible;
		color: #333333;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		z-index: 9999;
		background-color: #fff;
		// background-image: url('');
		.active_image{
			width: 40rpx;
			height: 40rpx;
			margin-bottom: 5rpx;
		}
		// height: 200rpx;
		// border-top: 1rpx solid #e5e5e5;
		.cover_item{
			// position: relative;
			width: 164rpx;
			height: 164rpx;
			// overflow: visible;
			position: fixed;
			bottom: 0;
			left: 294rpx;
			z-index: 99;
			.active_image{
				width: 40rpx;
				height: 40rpx;
			}
		}
	
	}
.flex_abc {
		display: flex;
		align-items: center;
		justify-content: center;
	}		
</style>